import { FC, ReactElement, useCallback } from "react";
import { Input } from "../../styled";

interface IProps {
  price: number;
  changePrice: (price: number) => void;
}

const Price: FC<IProps> = ({ price, changePrice }): ReactElement => {
  const handleBlur = useCallback(
    (event) => {
      changePrice(event.target.value);
    },
    [changePrice]
  );
  return (
    <Input
      label="价钱"
      placeholder="价钱"
      type="number"
      defaultValue={price}
      onBlur={handleBlur}
    />
  );
};

export default Price;
